﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Account.aspx.cs" Inherits="Golf.WebUI.Customers.Account" %>

<%@ Register Src="~/UserControl/Header.ascx" TagName="Header" TagPrefix="UserHeader" %>
<%@ Register Src="~/UserControl/footer.ascx" TagName="Footer" TagPrefix="UserFooter" %>
<%@ Register Src="~/UserControl/ToolbarContainer.ascx" TagName="Toolbal" TagPrefix="UserToolbal" %>
<%@ Register Src="~/UserControl/login.ascx" TagName="Login_" TagPrefix="UserLogin" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>
    <link href="/Style/Base.css" rel="stylesheet" type="text/css" />
    <link href="../Css/shared-not-home.css" rel="stylesheet" type="text/css" />

    <script src="../Script/jquery/jquery-1.4.1-vsdoc.js" type="text/javascript"></script>

    <script type="text/javascript">
     
        window.jQuery || document.write('<script src="/Script/jquery/jquery-1.4.1.min-vsdoc.js" type="text/javascript"><\/script>');
    </script>

    <script src="../Script/jquery.hoverIntent.minified.js" type="text/javascript"></script>

    <script type="text/javascript">
        $(function() {
            $(".over").hide();
            $(".accountTabs li a").click(function() {
                var id = $(this).attr("title");
                if ($("#" + id).is(":hidden")) {
                    $(".accountTabs li ").removeClass("open");
                    $(this).parent().addClass("open");
                    $(".content div").slideUp();
                    $(".content #" + id).slideDown();
                }
            });
            // Account_Details  Address_Details Order_History
            $(".btn_editAccountDetails").click(function() {
                $(".accountTabs li ").removeClass("open");
                $("#top_1").addClass("open");
                $(".content div").slideUp();
                $(".content #Account_Details").slideDown();
            });
            $(".btn_editAddresses").click(function() {
                $(".accountTabs li ").removeClass("open");
                $("#top_2").addClass("open");
                $(".content div").slideUp();
                $(".content #Address_Details").slideDown();
            });
            $(".btn_viewCompleteOrders").click(function() {
                $(".accountTabs li ").removeClass("open");
                $("#top_3").addClass("open");
                $(".content div").slideUp();
                $(".content #Order_History").slideDown();
            });

            $("#welcome_btnLogout").click(function() {
                $.ajax({
                    type: "POST",
                    contentType: "application/x-www-form-urlencoded",
                    url: "Account.aspx?" + Math.random(),
                    data: {
                        "action": "loginout"
                    },
                    success: function(msg) {
                        msg = msg.split('|')[0];
                        if (msg == '0') {
                            window.location.href = 'http://<%= HttpContext.Current.Request.Url.Host %>/Customers/Account.aspx';
                        }
                    },
                    error: function(xhr) {
                        alert(xhr.responseText);
                    }
                });
            });
        });
    </script>

    <style type="text/css">
        .accountContainer .content .largeContainerBottom
        {
            width: 390px;
            height: 10px;
            margin-bottom: 10px;
            background: url(/common/images/account/accountContainerLargeBg.png) no-repeat 0 bottom;
        }
        .accountContainer .content .mediumContainerBottom
        {
            width: 482px;
            height: 10px;
            margin-bottom: 10px;
            background: url(/common/images/account/accountContainerMediumBg.png) no-repeat 0 bottom;
        }
        #mainContent .overview
        {
            clear: left;
            width: 100%;
            padding-bottom: 10px;
            float: left;
            position: relative;
            background: url(/common/images/account/accountoverviewcontainerbottom.gif) no-repeat 0 bottom;
        }
        #mainContent .overview .caddy
        {
            width: 113px;
            height: 113px;
            position: absolute;
            top: 13px;
            right: 24px;
            background: url(/common/images/account/caddy.png) no-repeat 0 0;
        }
        #mainContent .overview .header
        {
            height: 82px;
            padding: 14px 0 0 18px;
            position: relative;
            background: url(/common/images/account/accountoverviewheaderbg.png) no-repeat 0 0;
        }
        #mainContent .overview .header h2
        {
            font-size: 1.8em;
            color: #fff;
        }
        #mainContent .overview .content
        {
            width: 946px;
            padding: 28px;
            overflow: auto;
            float: left;
            border-left: 1px solid #c9c9c9;
            border-right: 1px solid #c9c9c9;
            background: #eee url(/common/images/account/contentbg.gif) repeat-x 0 0;
        }
        #mainContent .overview .content .container h3
        {
            float: none;
        }
        #mainContent .overview .content .container a
        {
            float: right;
            margin-top: 14px;
        }
        #mainContent .overview .content .container p.wishTxt
        {
            font-size: 12px;
        }
        #mainContent .overview .content .container p.wishTxt a
        {
            font-weight: bold;
            float: none;
            margin: 0;
            text-decoration: underline;
        }
        #mainContent .overview .content .container p.loyaltyTxt
        {
            width: 114px;
            font-size: 11px;
            float: left;
        }
        #mainContent .overview .content .container p.loyaltyPoints
        {
            margin-left: 26px;
            float: left;
            font-size: 24px;
            font-weight: bold;
        }
        #mainContent .overview .content .container .deliveryAddress
        {
            width: 148px;
            padding: 10px;
            float: left;
        }
        #mainContent .overview .content .container .billingAddress
        {
            width: 148px;
            padding: 10px;
            margin-left: 10px;
            float: left;
        }
        #mainContent .overview .wrapper
        {
            float: left;
            width: 435px;
        }
        #mainContent .overview .content .largeContainer dl#accountDetails
        {
            overflow: auto;
        }
        #mainContent .overview .content .largeContainer dl#accountDetails dt
        {
            clear: left;
            float: left;
            width: 116px;
            margin: 0 8px 10px 0;
            font-size: 12px;
            font-weight: bold;
            text-align: right;
        }
        #mainContent .overview .content .largeContainer dl#accountDetails dd
        {
            clear: right;
            width: 226px;
            margin-bottom: 10px;
            float: right;
            font-size: 12px;
            text-align: left;
        }
        #mainContent .overview .content .largeContainer ul#accountAddresses
        {
            margin-left: 18px;
        }
        #mainContent .overview .content .largeContainer ul#accountAddresses li
        {
            margin-bottom: 10px;
            list-style: decimal;
            font-size: 10px;
        }
        #mainContent .overview .content .mediumContainer table#tbOrderHistory
        {
            width: 230px;
        }
        #mainContent .overview .content .mediumContainer table#tbOrderHistory tr td
        {
            font-size: 10px;
            line-height: normal;
            padding: 0;
            border: none;
            background: none;
        }
        #mainContent .overview .content .mediumContainer table#tbOrderHistory tr td.right
        {
            text-align: right;
        }
        #mainContent .overview .content .mediumContainer table#tbOrderHistory tr td a.view
        {
            padding-left: 18px;
            font-size: 11px;
            text-decoration: underline;
            background: url(/common/images/shell/book.gif) no-repeat 0 center;
        }
        #mainContent .overview .content .narrowContainer ul#currentSettings li
        {
            width: 100%;
            margin: 0 0 10px;
            font-size: 14px;
        }
        #mainContent .overview .content .narrowContainer ul#currentSettings li strong
        {
            margin-right: 4px;
        }
        #mainContent .accountContainer .header ul.accountTabs
        {
            position: absolute;
            bottom: 0;
            left: 0;
            padding: 5px 0 0 2px;
            right: 415px;
        }
        #mainContent .accountContainer .header ul.accountTabs li
        {
            float: left;
            margin: 0 -1px;
            cursor: pointer;
        }
        #mainContent .accountContainer .header ul.accountTabs li a
        {
            padding: 0 16px 0 0;
            display: block;
            color: #676666;
            cursor: pointer;
            background: url(/common/images/account/tab_right.png) no-repeat right -40px;
        }
        #mainContent .accountContainer .header ul.accountTabs li a strong
        {
            padding: 9px 0 6px 15px;
            display: block;
            background: url(/common/images/account/tab_left.png) no-repeat 0 -40px;
        }
        #mainContent .accountContainer .header ul.accountTabs li.open
        {
            margin: 0;
        }
        #mainContent .accountContainer .header ul.accountTabs li.open a
        {
            padding: 0 10px 0 0;
            color: #000;
            background-position: right 0;
        }
        #mainContent .accountContainer .header ul.accountTabs li.open a strong
        {
            padding: 9px 0 6px 17px;
            background-position: 0 0;
        }
        #mainContent .accountContainer .content .largeContainer
        {
            width: 350px;
            padding: 16px 20px;
            margin-right: 14px;
            background: url(/common/images/account/accountcontainerlargebg.png) no-repeat 0 0;
        }
        #mainContent .accountContainer .content .mediumContainer
        {
            width: 471px;
            padding: 16px 20px;
            margin-right: 14px;
            background: url(/common/images/account/accountContainerMediumBg.png) no-repeat 0 0;
        }
        #mainContent .overview .content .mediumContainer table#tbOrderHistory
        {
            width: 380px;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server" style="background-color: White; width: 1004px; margin: 0px auto;">
    <UserHeader:Header ID="UserHeader" runat="server" />
    <div style="clear: both; width: 1px;">
    </div>
    <div id="mainContent" style="width: 1004px; clear: both; background-color: White;">
        <div class="topContent" style="clear: left; height: 50px; padding-top: 10px; width: 1004px;
            margin: 0px; line-height: 25px;">
            <div style="width: 750px; float: left; padding-left: 10px; font-size: 1.1em;">
                <h2 style="font-size: 1.1em; float: left; margin-right: 8px;">
                    Welcome back, <span style="color: #89BC05;">
                        <%=Customer_Email%></span></h2>
                <p style="line-height: 26px; font-size: 11px; float: left;">
                    (if you're not
                    <% =Customer_Email%>
                    <a onclick="return confirm('This will log you out of your account.\n\n Are you sure you wish to continue?');"
                        id="welcome_btnNotMe" title="Click Here" href="#">Click Here </a>)</p>
            </div>
            <div class="logout" style="padding-left: 14px; float: right; background: url(/common/images/shell/bulletGreen.png) no-repeat 0 8px;
                width: 150px;">
                <a onclick="return confirm('This will log you out of your account.\n\n Are you sure you wish to continue?');"
                    id="welcome_btnLogout" title="LogOut" href="javascript:void();" style="font-size: 1.1em;
                    font-weight: bold; text-decoration: underline;">LogOut</a>
            </div>
        </div>
        <div class="accountContainer overview">
            <div class="header">
                <h2>
                    Account Overview</h2>
                <ul class="accountTabs">
                    <li style="width: 151px;" id="top_1"><a href="#" title="Account_Details"><strong>Account
                        Details</strong></a></li>
                    <li style="width: 151px;" id="top_2"><a href="#" title="Address_Details"><strong>Address
                        Details</strong></a></li>
                    <li style="width: 151px;" id="top_3"><a href="#" title="Order_History"><strong>Order
                        History</strong></a></li>
                </ul>
            </div>
            <div class="caddy">
            </div>
            <div style="clear: both; width: 1px;">
            </div>
            <div class="content">
                <div id="default">
                    <div class="wrapper">
                        <div class="container largeContainer">
                            <!--Account Details-->
                            <h3>
                                Account Details</h3>
                            <dl id="accountDetails">
                                <div>
                                    <strong>Name:</strong><%=_Name%></div>
                                <div>
                                    <strong>Email</strong>
                                    <%=_Email%></div>
                                <dt><strong>Password:</strong>************</dt>
                            </dl>
                            <a href="#" title="" class="btn_editAccountDetails" style="height: 1px;">
                                Edit Account Details</a>
                            <br />
                        </div>
                        <div class="largeContainerBottom">
                        </div>
                        <div class="container largeContainer">
                            <!---Address Details-->
                            <h3>
                                Address Details</h3>
                            <ul id="accountAddresses">
                                <asp:Repeater ID="Repeater2" runat="server">
                                    <ItemTemplate>
                                        <li style="font-size: 12px;">
                                            <%#Eval("Address")%>,<%#Eval("City")%>,<%#Eval("PostCode")%>,<%#Eval("Province")%>
                                        </li>
                                    </ItemTemplate>
                                </asp:Repeater>
                            </ul>
                            <a href="#" title="Edit Addresses" style="height: 1px;" class="btn_editAddresses">
                            </a>
                            <br />
                        </div>
                        <div class="largeContainerBottom">
                        </div>
                    </div>
                    <div class="wrapper">
                        <div class="container mediumContainer">
                            <!--Order History-->
                            <h3>
                                Order History</h3>
                            <h4>
                                Current Outstanding Orders</h4>
                            <table id="tbOrderHistory">
                                <tbody>
                                    <asp:Repeater ID="rep_Order_History" runat="server">
                                        <ItemTemplate>
                                            <tr>
                                                <td>
                                                    <a href="Order6970554.aspx" style="float: none;">
                                                        <%#Eval("OrderNumber")%></a>
                                                </td>
                                                <td>
                                                    ...........................................
                                                </td>
                                                <td class="right">
                                                    <a href="Order_<%#Eval("OrderNumber") %>.aspx" class="view" style="float: none;">view</a>
                                                </td>
                                            </tr>
                                        </ItemTemplate>
                                    </asp:Repeater>
                                </tbody>
                            </table>
                            <a href="#" title="View Complete Order
                                History" style="height: 1px;" class="btn_viewCompleteOrders"></a>
                            <br />
                        </div>
                        <div class="mediumContainerBottom">
                        </div>
                    </div>
                </div>
                <div id="Account_Details" class="over">
                    <iframe src="AccountDetails.aspx" width="780" height="930" style="background-color: Transparent;">
                    </iframe>
                </div>
                <div id="Address_Details" class="over">
                    <iframe src="AddressDetails.aspx" width="780" height="630" style="background-color: Transparent;">
                    </iframe>
                </div>
                <div id="Order_History" class="over">
                    <iframe src="OrderHistory.aspx" width="780" height="630" style="background-color: Transparent;
                        border: 0px;"></iframe>
                </div>
            </div>
        </div>
        <div style="clear: both; width: 1px;">
        </div>
    </div>
    <UserFooter:Footer ID="UserFooter" runat="server" />
    <UserToolbal:Toolbal ID="UserToolbal" runat="server" />
    </form>
    <UserLogin:Login_ ID="userLogin" runat="server" />
</body>
</html>

<script type="text/javascript">
        var loginState=<%=loginState %>
        if(loginState==0){
        MAD.lightBox.show(".loginSignUpBox");
        }
</script>

